<template>
  <!-- 部门-树下拉框查询 -->
  <a-tree-select
    v-bind="$attrs"
    v-on="$listeners"
    v-model="currentValue"
    :tree-data="treeData"
    allowClear
    showSearch
    treeDefaultExpandAll
    :filterTreeNode="fillter"
    :replaceFields="{ children: 'children', title: 'label', key: 'id', value: 'id' }"
    :show-checked-strategy="SHOW_CHILD"
    :placeholder="placeholder"
  >
    <a-icon v-if="fetching" style="color: #096dd9" slot="suffixIcon" type="loading" />
  </a-tree-select>
</template>
<script>
import { getCustOrgTree } from '@/api/subassembly/TreeSelectOrganization'
import { TreeSelect } from 'ant-design-vue'
const SHOW_CHILD = TreeSelect.SHOW_CHILD

export default {
  name: 'SelectTreeDepartment',
  data() {
    return {
      fetching: false,
      isCanClear: !this.isEdit,
      treeData: [],
      SHOW_CHILD
    }
  },
  props: {
    // v-model绑定的数据
    value: {
      type: [Array, String, Object]
    },
    // placeholder
    placeholder: {
      type: String,
      default: () => '请选择'
    },
    // 请求额外参数
    queryParams: {
      type: Object,
      default: () => ({})
    }
  },
  computed: {
    // 转换绑定的选中数据，与v-model同步
    currentValue: {
      get: function () {
        return this.value
      },
      set: function (value) {
        this.$emit('input', value)
      }
    }
  },
  created() {
    this.getList()
  },
  methods: {
    /**
     * 筛选节点
     */
    fillter(searchVal, treeNode) {
      return treeNode?.data?.props?.label?.includes(searchVal)
    },
    /**
     * 格式化全部节点
     */
    getData(data) {
      for (let item of data) {
        // 除部门外全部禁用
        item.disabled = item.children ? true : false
        if (item.children?.length > 0) {
          // 生成父子组合名
          for (let i of item.children) {
            i.combindName = item.combindName ? item.combindName + '_' + i.label : item.label + '_' + i.label
          }
          this.getData(item.children)
        } else {
          item.label = item.combindName
        }
      }
    },
    /**
     * 获取树
     */
    getList() {
      // 获取组织机构
       let params = {
        baseOrgType:0,
         types: "1,2,3,7,8"
       }
      let args = Object.assign({},params, this.queryParams)
      this.fetching = true
      getCustOrgTree(args)
        .then((res) => {
          this.fetching = false
          if (res.data?.length > 0) {
            this.getData(res.data)
            this.treeData = res.data
          }
        })
        .catch(() => {
          this.fetching = false
        })
    }
  }
}
</script>
